<template>
    <div class="main-wrapper">
        <Content :goodsInfo="goodsInfo"></Content>
        <Comments :commentList="commentList" @addComment="addComment"></Comments>
    </div>
</template>

<script>
import Comments from "@/pages/Detail/Main/Comments";
import Content from "@/pages/Detail/Main/Content";

export default {
    data() {
        return {
            commentList:[
                {
                    commentId:1,
                    userName:"笑心",
                    userId:20204092,
                    portraitUrl:"./images/portrait1.jpg",
                    comment:"舍友买了同款，灯光酷炫，真的好用啊，这价位还要什么自行车"
                },
                {
                    commentId:2,
                    userName:"子期",
                    userId:20190817,
                    portraitUrl:"./images/portrait2.jpg",
                    comment:`看到这个键盘让我想起了我的初恋，以前她也曾送过这个键盘给我，可惜我年少无为多脾气伤害了她，
                    但真的好用啊`
                },
                {
                    commentId:3,
                    userName:"少卿",
                    userId:20202715,
                    portraitUrl:"./images/portrait3.jpg",
                    comment:"这个键盘看着真漂亮用来送即将成年的女朋友刚刚好"
                },
                {
                    commentId:4,
                    userName:"指尖碎流年",
                    userId:20202711,
                    portraitUrl:"./images/portrait4.jpg",
                    comment:"我就是上面那个帅哥的好舍友，这键盘确实好用，去年双十一就入手了，剁手不亏快冲"
                },
                {
                    commentId:5,
                    userName:"谭立明",
                    userId:20202706,
                    portraitUrl:"./images/portrait5.jpg",
                    comment:"隔壁宿舍的同学用的就是这个，看着真漂亮"
                }
            ]
        }
    },
    props:["goodsInfo"],
    components:{
        Comments,
        Content
    },
    methods:{
        addComment(comment){
            // 先发送请求，等请求通过了，然后再添加，等服务器完善了再弄
            this.commentList.unshift(comment);
        }
    }
};
</script>

<style scoped>
.main-wrapper {
    width: 100%;
    background: white;
    padding-bottom: 60px;
}

</style>